<template>
    <div>
        <nav class="top_title">
            <div>
                <slot name="title_image">
                    <img src="../assets/images/return.png" class="title_image" />
                </slot>
            </div>
            <div style="height:50px;margin-left:10px;">
                <div class="top_title_menu">菜单</div>
                <span class="top_title_text">{{title}}</span>
            </div>
            <img src="../assets/images/more.png" alt="" style="width:30px;height:30px;margin-right:5px;">
        </nav>
    </div>
</template>

<script>
    export default {
        props:{
            title:String
        }
    }
</script>

<style scoped>
.top_title{
    height:50px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-bottom:1px solid #ccc;
}
.top_title_menu{
    font-size:1.2rem;
    margin-top:8px;
    text-align: center;
}
.top_title_text{
    color:#bbb
}
.title_image{
  width:2.5rem;
  height: 2.5rem;
  margin-left:5px;
}
</style>